<template>
  <div class="les-purchase-order-info-block">
    <s-table
      ref="table"
      :columns="columns"
      :data="loadData"
      :alert="true"
      rowKey="tableRowKey"
      :pageSize="queried.PageSize"
      :pageSizeOptions="['5','10','20','30']"
      :rowSelection="null">
      <template class="table-operator" slot="operator" >
        <span style="font-weight:bold;cursor:default;"><a style="cursor:default;">{{orderNo}}</a>单据详情</span>
      </template>
      <template slot="index" slot-scope="text,record,index">{{(queried.PageNo-1)*queried.PageSize+(index+1)}}</template>
      <template slot="statusSlots" slot-scope="text,record">
        <a-tag :color="text==='完成'?'#008000':(
          text==='执行中'?'#1e90ff':(
            text==='取消'?'#556b2f':(
              text==='暂停'?'#8b0000':(
                text==='撤回'?'#ff00ff':'gray'
              )
            )
          )
        )">{{text}}</a-tag>
      </template>
    </s-table>
  </div>
</template>

<script>
import { STable } from '@/components'
import { PurchaseOrderDetailPage } from '@/api/modular/main/PurchaseOrderManage'
const pagination = {PageNo:1,PageSize:5}
export default {
  name:'lesPurchaseOrderInfoBlock',
  emits:["callback"],
  components:{STable},
  props:{
    queryId:{
      type:[Number,null],
      default:null
    },
    orderNo:{
      type:String,
      default:''
    }
  },
  data(){
    return {
      columns:[
        { title: '序号', key: 'index', width: 70, align:'center', fixed:"left", scopedSlots: { customRender: 'index' }},
        // { title: '物料ID', align:'center', dataIndex: 'materialId', key: 'materialId' },
        { title: '物料编码', align:'center', dataIndex: 'materialCode', key: 'materialCode' },
        { title: '物料名称', align:'center', dataIndex: 'materialName', key: 'materialName' },
        // { title: '物料版本', align:'center', dataIndex: 'materialVersion', key: 'materialVersion' },
        { title: '物料类别', align:'center', dataIndex: 'materialType', key: 'materialType' },
        { title: '尺寸', align:'center', dataIndex: 'materialSpec', key: 'materialSpec' },
        { title: '密度', align:'center', dataIndex: 'materialDensity', key: 'materialDensity' },
        { title: '单位', align:'center', dataIndex: 'unitType', key: 'unitType' },
        { title: '备注', align:'center', dataIndex: 'remarks', key: 'remarks' },
        { title: '是否手工拣货', align:'center', dataIndex: 'isManualPicking', key: 'isManualPicking' },
        { title: '订货数', align:'center', dataIndex: 'orderDetailQuantity', key: 'orderDetailQuantity' },
        // { title: '周转规则', align:'center', dataIndex: 'turnoverRules', key: 'turnoverRules' },
        // { title: '分配规则', align:'center', dataIndex: 'allocationRules', key: 'allocationRules' },
        { title: '计划数', align:'center', dataIndex: 'planQuantity', key: 'planQuantity' },
        { title: '分配数', align:'center', dataIndex: 'allocationQuantity', key: 'allocationQuantity' },
        { title: '拣货数', align:'center', dataIndex: 'pickingQuantity', key: 'pickingQuantity' },
        { title: '发货数', align:'center', dataIndex: 'sendGoodsQuantity', key: 'sendGoodsQuantity' },
        { title: '发货人', align:'center', dataIndex: 'shipperMan', key: 'shipperMan' },
        { title: '检验结果', align:'center', dataIndex: 'inspectionResults', key: 'inspectionResults' }
      ],
      queried:{...pagination},
      refreshKey:true,
    }
  },
  watch:{
    queryId(newV,oldV){
      if (newV!==oldV){
        this.initData()
      }
    }
  },
  methods:{
    initData(){
      this.refreshKey = true
      this.$refs.table.refresh()
    },
    loadData(parameter){
      parameter.PurchaseOrderId = this.queryId
      if (this.queryId) {
        if (this.refreshKey) {
          parameter.pageNo = pagination.PageNo
          parameter.pageSize = pagination.PageSize
        } 
        this.refreshKey = false
        this.queried.PageNo = parameter.pageNo 
        this.queried.PageSize = parameter.pageSize 
        return PurchaseOrderDetailPage(parameter).then((res) => {
          if (res.data.rows) {
            res.data.rows = res.data.rows.map((item,index)=>{
              item.tableRowKey = index
              return item
            })
          }
          return res.data
        })
      } else {
        return new Promise((resolve,reject)=>{
          resolve({
            pageNo:pagination.PageNo,
            pageSize:pagination.PageSize,
            rows:[],
            totalPage:0,
            totalRows:0
          })
        })
      } 
    },
  }
}
</script>

<style lang="less" scoped>
.les-purchase-order-info-block{
  padding-top: 8px;
}
</style>